<template>
  <div>
    <div class="area-header">
      <span class="area-header-title">{{ $t('基金分配-出资人分配详情') }}</span>
    </div>
    <el-table v-loading="loading" :data="fundInvestorFpDetailsList" border>
      <el-table-column :label="$t('序号')" type="index" align="center" show-overflow-tooltip width="50">
        <template slot-scope="scope">
          {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
        </template>
      </el-table-column>
      <el-table-column :label="$t('出资人名称')" align="center" prop="userName" min-width="180" show-overflow-tooltip />
      <el-table-column :label="$t('出资人类型')" align="center" prop="investorsType" :formatter="investorsTypeOptionsFormat" min-width="140" show-overflow-tooltip />
      <!--      <el-table-column :label="$t('分配或补亏项目')" align="center" prop="dealName" min-width="180" show-overflow-tooltip />-->
      <el-table-column :label="$t('本金') + $t('金额单位')" align="center" prop="principalCost">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.principalCost, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('Hurdle') + $t('金额单位')" align="center" prop="priorityReturn" min-width="120">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.hurdleTheory, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('股息红利') + $t('金额单位')" align="center" prop="dividends" min-width="120">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.dividends, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('追赶条款') + $t('金额单位')" align="center" min-width="130" prop="chaseTerms">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.chaseTerms, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('剩余分配LP') + $t('金额单位')" align="center" min-width="130" prop="surplusLp">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.surplusLp, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('剩余分配GP') + $t('金额单位')" align="center" min-width="130" prop="surplusGp">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.surplusGp, 'w') }}</span>
          <span style="display: none">{{ !otherBtnHide }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('代扣税费') + $t('金额单位')" align="center" min-width="100">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.taxeFee, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="!otherBtnHide"
        :label="$t('操作')"
        fixed="right"
        align="center"
        class-name="small-padding fixed-width"
        width="200"
      >
        <template slot-scope="scope">
          <el-button
            v-hasPermi="['fund:fp:edit']"
            size="small"
            type="text"
            icon="el-icon-edit"
            @click="editFpDetails(scope.row)"
          >{{ $t('修改') }}
          </el-button>
          <el-button
            v-hasPermi="['fund:fp:remove']"
            size="small"
            type="text"
            icon="el-icon-delete"
            @click="deleteHandle(scope.row)"
          >{{ $t('删除') }}
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 基金分配明细对话框, 出资人当前这次分配的详情数据 -->
    <el-dialog
      :title="title"
      :visible.sync="formOpen"
      :close-on-click-modal="false"
      :lock-scroll="false"
      custom-class="dialogForm"
      append-to-body
    >
      <fund-fp-details-edit-form ref="fundFpDetailsEditForm" />
    </el-dialog>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { delFundFpDetails, listfundInvestorFpDetails } from '@/api/fund/fp/fundFpDetails'
import fundFpDetailsEditForm from './fundFpDetailsEditForm.vue'
export default {
  components: {
    fundFpDetailsEditForm
  },
  props: {
    otherBtnHide: {
      type: Boolean,
      default: () => false
    }
  },
  data() {
      return {
          // 遮罩层
          loading: true,
          // 总条数
          total: 0,
          // 基金分配-分配详情表格数据
          fundInvestorFpDetailsList: [],
          investorsTypeOptions: [],
          // 弹出层标题
          title: '',
          // 是否显示弹出层
          formOpen: false,
          // 查询参数
          queryParams: {
              fpId: undefined,
              investorId: undefined,
              pageNum: 1,
              pageSize: 10
          },
          // 表单参数
          form: {},
          // 表单校验
          rules: {
          }
      }
  },
  created() {
    // 类型字典1
    this.getDicts('main_body_type').then(response => {
      response.data.forEach(item => {
        this.investorsTypeOptions.push(item)
      })
    })
    // 类型字典2
    this.getDicts('lp_type').then(response => {
      response.data.forEach(item => {
        this.investorsTypeOptions.push(item)
      })
    })
  },
  methods: {
    getList() {
      this.loading = true
      listfundInvestorFpDetails(this.queryParams).then(response => {
        this.fundInvestorFpDetailsList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    // 修改出资人分配明细页面
    editFpDetails(row) {
      this.formOpen = true
      this.title = this.$t('基金分配-修改出资人分配详情')
      this.$nextTick(() => {
        this.$refs.fundFpDetailsEditForm.init(row)
      })
    },
    getfundInvestorFpDetails(row) {
      this.loading = true
      this.queryParams.fpId = row.fpId
      this.queryParams.investorId = row.investorId
      listfundInvestorFpDetails(this.queryParams).then(response => {
        this.fundInvestorFpDetailsList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    getfundInvestorFpDetailsByFundId(row) {
      this.loading = true
      this.queryParams.fundId = row.fundId
      this.queryParams.investorId = row.id
      listfundInvestorFpDetails(this.queryParams).then(response => {
        this.fundInvestorFpDetailsList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    // 出资人类型
    investorsTypeOptionsFormat(row) {
      return this.selectDictLabel(this.investorsTypeOptions, row.investorsType)
    },
    // 表单重置
    reset() {
      this.form = {
        id: undefined,
        fundId: undefined,
        fpId: undefined,
        investorId: undefined,
        investorName: undefined,
        userName: undefined,
        investorsType: undefined,
        assignItems: undefined,
        fpTime: undefined,
        principalCost: undefined,
        lpCapitalRatio: undefined,
        priorityReturn: undefined,
        clauseTheory: undefined,
        surplusLp: undefined,
        surplusGp: undefined,
        fpSourceId: undefined,
        dealId: undefined,
        dealName: undefined,
        dealBkId: undefined,
        chaseTerms: undefined,
        balanceFp: undefined,
        taxeFee: undefined,
        allCapitalRatio: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined,
        delFlag: undefined,
        remark: undefined
      }
      this.resetForm('form')
    },
    /** 删除按钮操作 */
    deleteHandle(row) {
      this.$confirm(this.$t('是否确认删除?'), this.$t('警告'), {
        confirmButtonText: this.$t('确定'),
        cancelButtonText: this.$t('取消'),
        type: 'warning'
      }).then(() => {
        return delFundFpDetails(row.id)
      }).then(() => {
        this.getList()
        this.msgSuccess(this.$t('删除成功'))
        this.$parent.$parent.listDetailGroupInvestor(row)
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>
